<template>
  <div>
		<div class="page-header col-xs-offset-2 col-xs-8">
			<h2>Vue路由测试</h2>
		</div>
		<!-- 导航区域 -->
		<div class="col-xs-2 col-xs-offset-2">
			<!-- 在Vue应用中，我们靠<router-link>标签，进行路径的切换 -->
			<router-link active-class="active" class="list-group-item" to="/about">About</router-link>
			<router-link active-class="active" class="list-group-item" :to="{path:'/home'}">Home</router-link>
		</div>
		<!-- 展示区 -->
		<div class="col-xs-6 panel panel-body panel-primary">
			<!-- router-view是占位符，让路由器知道把要呈现的路由组件放在哪里 -->
			<router-view></router-view>
		</div>
	</div>
</template>

<script>
  export default {
    name:'App',
  }
</script>
